// app/(auth)/register/page.tsx - 注册页，属于认证路由分组
import { Button, Form, Input, Card, Select } from 'antd';
import Link from 'next/link';

const { Option } = Select;

export default function RegisterPage() {
    const onFinish = (values: any) => {
        console.log('Success:', values);
        // 实际应用中这里会处理注册逻辑
    };

    const onFinishFailed = (errorInfo: any) => {
        console.log('Failed:', errorInfo);
    };

    return (
        <Card>
            <Form
                name="register"
                labelCol={{ span: 8 }}
                wrapperCol={{ span: 16 }}
                initialValues={{ role: 'user' }}
                onFinish={onFinish}
                onFinishFailed={onFinishFailed}
                autoComplete="off"
            >
                <Form.Item
                    label="用户名"
                    name="username"
                    rules={[{ required: true, message: '请输入用户名!' }]}
                >
                    <Input />
                </Form.Item>

                <Form.Item
                    label="邮箱"
                    name="email"
                    rules={[
                        { required: true, message: '请输入邮箱!' },
                        { type: 'email', message: '请输入有效的邮箱地址!' },
                    ]}
                >
                    <Input />
                </Form.Item>

                <Form.Item
                    label="密码"
                    name="password"
                    rules={[{ required: true, message: '请输入密码!' }]}
                >
                    <Input.Password />
                </Form.Item>

                <Form.Item
                    label="角色"
                    name="role"
                    rules={[{ required: true, message: '请选择角色!' }]}
                >
                    <Select placeholder="请选择角色">
                        <Option value="user">普通用户</Option>
                        <Option value="admin">管理员</Option>
                    </Select>
                </Form.Item>

                <Form.Item wrapperCol={{ offset: 8, span: 16 }}>
                    <Button type="primary" htmlType="submit">
                        注册
                    </Button>
                    <span style={{ margin: '0 10px' }}>或</span>
                    <Link href="/login">
                        <Button type="default">已有账号？登录</Button>
                    </Link>
                </Form.Item>
            </Form>
        </Card>
    );
}
